<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>点菜</title>
    <link rel="stylesheet" href="css/globe.css"/>
    <link rel="stylesheet" href="css/dish_list.css"/>
    <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="js/getParameter.js"></script>
    <script>
        $(function () {
            var dishName = decodeURI(getParameter("dishName"));
            if (dishName!=="null" ) $("#search_input").val(dishName);
            load(1, dishName, null);
        });

        function load(currentPage, dishName, categoryName) {
            $.ajax({
                url: "${pageContext.request.contextPath}/dish/findDish",
                type: "get",
                dataType: "json",
                data: {
                    currentPage: currentPage,
                    pageSize: 15,
                    dishName: dishName,
                    categoryName: categoryName
                },
                success: function (data) {
                    if (data) {
                        $("#totalPage").html(data.totalPage);
                        $("#totalCount").html(data.totalCount);

                        var lis = "";
                        var firstPage = '<li onclick="javascript:load(1,\'' + dishName + '\')"><a href="javascript:void(0);">首页</a></li>';
                        var beforeNum = data.currentPage - 1;
                        if (beforeNum < 1) {
                            beforeNum = 1;
                        }
                        var beforePage = '<li onclick="javascript:load(' + beforeNum + ', \'' + dishName + '\')" class="threeword"><a href="javascript:void(0);">上一页</a></li>'
                        lis += firstPage;
                        lis += beforePage;

                        var begin;
                        var end;
                        if (data.totalPage < 10) {
                            begin = 1;
                            end = data.totalPage;
                        } else {
                            begin = data.currentPage - 5;
                            end = data.currentPage + 4;
                            if (begin < 1) {
                                begin = 1;
                                end = begin + 9;
                            }
                            if (end > data.totalPage) {
                                end = data.totalPage;
                                begin = end - 9;
                            }
                        }
                        for (var i = begin; i <= end; i++) {
                            var li;
                            if (data.currentPage === i) {
                                li = '<li class="curPage" onclick="javascript:load(' + i + ', \'' + dishName + '\');"><a href="javascript:void(0);">' + i + '</a></li>'
                            } else {
                                li = '<li onclick="javascript:load(' + i + ', \'' + dishName + '\');"><a href="javascript:void(0);">' + i + '</a></li>'
                            }
                            lis += li;
                        }

                        var preNum = data.currentPage + 1;
                        if (preNum > data.totalPage) {
                            preNum = data.totalPage;
                        }
                        var prePage = '<li onclick="javascript:load(' + preNum + ', \'' + dishName + '\');" class="threeword"><a href="javascript:;">下一页</a></li>'
                        var lastPage = '<li onclick="javascript:load(' + data.totalPage + ', \'' + dishName + '\');" class="threeword"><a href="javascript:;">末页</a></li>'

                        lis += prePage;
                        lis += lastPage;

                        $("#pageNum").html(lis);

                        var dish_lis = "";
                        for (var i = 0; i < data.list.length; i++) {
                            var dish = data.list[i];
                            var li =
                                '<li>\n' +
                                '    <div class="img"><img src="' + dish.imagesRoute + '"></div>\n' +
                                '    <div class="text1">\n' +
                                '        <p>' + dish.dishName + '</p>\n' +
                                '        <br/>\n' +
                                '        <p>' + dish.description + '</p>\n' +
                                '    </div>\n' +
                                '    <div class="price">\n' +
                                '        <p class="price_num">\n' +
                                '            <span>&yen;</span>\n' +
                                '            <span>' + dish.dishPrice + '</span>\n' +
                                '            <span>起</span>\n' +
                                '        </p>\n' +
                                '        <p><a href="dish_detail.jsp?dishId=' + dish.dishId + '">查看详情</a></p>\n' +
                                '        <p><a href="javascript:addCart(' + dish.dishId + ');">加入购物车</a></p>\n' +
                                '    </div>\n' +
                                '</li>';
                            dish_lis += li;
                        }
                        $("#dish").html(dish_lis);
                        window.scrollTo(0, 0);
                    }
                },
                error: function () {
                    alert("查询失败");
                }
            });
        }

        function addCart(dishId) {
            var userId = '<%=session.getAttribute("userId")%>';
            if (!(userId !== "null" && userId.length > 0)) {
                alert("您还未登录，请登录");
                window.location.href = "${pageContext.request.contextPath}/login.jsp";
                return;
            }
            $.ajax({
                url: "${pageContext.request.contextPath}/cart/editCart",
                type: "post",
                dataType: "json",
                data: {
                    userId: userId,
                    dishId: dishId,
                    count: 1
                },
                success: function (data) {
                    if (data.flag) {
                        alert("加入购物车成功！")
                    } else {
                        alert("加入购物车失败！")
                    }
                },
                error: function () {
                    alert("发送失败");
                }
            });
        }
    </script>
</head>
<body>
<jsp:include page="user_bar.jsp"/>
<div id="main_page">
    <jsp:include page="search_box.jsp"/>
    <div class="xinxi clearfix">
        <div class="dish_div">
            <div class="header">
                <span>菜品信息</span>
            </div>
            <ul id="dish">
<%--                <li>--%>
<%--                    <div class="img"><img src="img/img1.jpeg" alt=""></div>--%>
<%--                    <div class="text1">--%>
<%--                        <p>炸鸡套票</p>--%>
<%--                        <br/>--%>
<%--                        <p>抢完即止！</p>--%>
<%--                    </div>--%>
<%--                    <div class="price">--%>
<%--                        <p class="price_num">--%>
<%--                            <span>&yen;</span>--%>
<%--                            <span>299</span>--%>
<%--                            <span>起</span>--%>
<%--                        </p>--%>
<%--                        <p><a href="dish_detail.jsp">查看详情</a></p>--%>
<%--                        <p><a href="cart/editCart">加入购物车</a></p>--%>
<%--                    </div>--%>
<%--                </li>--%>
            </ul>

            <div class="page_num_inf">
                <i></i>共
                <span id="totalPage"></span>页
                <span id="totalCount"></span>条
            </div>
            <div class="pageNum">
                <ul id="pageNum">
<%--                    <li><a href="">首页</a></li>--%>
<%--                    <li class="threeword"><a href="#">上一页</a></li>--%>
<%--                    <li><a href="#">1</a></li>--%>
<%--                    <li><a href="#">2</a></li>--%>
<%--                    <li><a href="#">3</a></li>--%>
<%--                    <li class="threeword"><a href="javascript:;">下一页</a></li>--%>
<%--                    <li class="threeword"><a href="javascript:;">末页</a></li>--%>
                </ul>
            </div>
        </div>


    </div>
</body>
</html>
